<template>
  <Modal id="notes-modal"
         v-model="visible"
         width="800px"
         okText="发送">
    <editor class="editor"
            ref="editor"
            :value="content"
            @on-change="handleChange" />
    <div slot="footer"
         class="footer">
      <Button type="primary"
              @click="visible=false">取消</Button>
      <Button type="primary"
              @click="dataFormSubmit">确认</Button>
    </div>
  </Modal>
</template>
<script>
import Editor from '_c/editor'
import { mapState } from 'vuex'
import { saveCommentInfo } from '@/api/data'
export default {
  data () {
    return {
      visible: false,
      content: '',
      data: {}
    }
  },
  computed: {
    ...mapState({
      roleId: state => state.user.roleId,
      userId: state => state.user.userId,
    }),
  },
  methods: {
    init (item) {
      this.data = item
      this.visible = true
      this.$nextTick(() => {
        this.$refs.editor.setHtml('')
      })
    },
    handleChange (html, text) {

    },
    dataFormSubmit () {
      let data = {
        "content": this.$refs.editor.getHtml(),
        "courseId": this.data.courseId,
        "parentId": this.data.discussId,
        "roleId": this.roleId,
        "userId": this.userId
      }
      saveCommentInfo(data).then((res) => {
        if (res.data == true) {
          this.$Message.success('发表评论成功')
          eventBus.$emit('courseDetails')
        } else {
          this.$Message.error('发表评论失败')
        }
        this.visible = false
      })
    },

  },
  components: {
    Editor
  }
}
</script>
<style lang="scss">
#notes-modal {
  .ivu-modal-mask {
    z-index: 10000000000 !important;
  }
  .ivu-modal-wrap {
    z-index: 10000000000 !important;
  }
  .editor {
    margin-top: 40px;
  }
}
</style>
